<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2024-01-10
  Time: 16:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>课工厂题库</title>
    <%--   href里面加 ?v=1 让css实时刷新--%>
    <link rel="icon" type="image/x-icon" href="https://tiku.kgc.cn/testing/favicon.ico"/>
    <link href="css/zhuym.css?v=1" rel="stylesheet" type="text/css">
</head>
<body>
<div>
    <%@ include file="ProjectPage/Tobu.jsp"%>
    <div class="hjlk">
        <div class="zhuzi">
            <div class="paihang">
                <div class="paihkg">分类自测</div>
                <div class="paihkg2">本班排行</div>
                <div class="paihkg2">本校排行</div>
                <div class="paihkg2">全国排行</div>
            </div>
            <div class="brdan">
                本日答题
            </div>
            <div class="stqk">
                <div><img src="img/img_5.png"/></div>
                <div class="ziti">今天还没有刷题哟~加油！</div>
            </div>
            <div class="brdan">
                测试入口
            </div>
            <div class="tmcshi">
                <div class="jxiangjin1">
                    <div class="tuxiang"><img src="img/img_6.png"/></div>
                    <div>专项技能型<img src="img/img_7.png"/></div>
                    <div class="wctimu">完成1301道题</div>
                    <div onclick="shijrko()" class="jinru">进入</div>
                </div>
                <div class="jxiangjin">
                    <div class="tuxiang"><img src="img/img_8.png"/></div>
                    <div>专项技能型<img src="img/img_7.png"/></div>
                    <div class="wctimu">完成1301道题</div>
                    <div onclick="shijrko2()" class="jinru">进入</div>
                </div>
                <div class="jxiangjin">
                    <div class="tuxiang"><img src="img/img_9.png"/></div>
                    <div>专项技能型<img src="img/img_7.png"/></div>
                    <div class="wctimu">完成1301道题</div>
                    <div onclick="shijrko3()" class="jinru">进入</div>
                </div>
            </div>
            <div class="jishit">
                <div class="mkl"></div>
                <div class="tmubj">机试题</div>
                <div class="bjv">
                    <table border="1" cellspacing="0" cellpadding="1" class="biaog">
                        <tr>
                            <td width="300">试题名称</td>
                            <td width="80">试题内容</td>
                            <td width="70">素材</td>
                            <td width="100">推荐完成时间</td>
                            <td width="300">涉及技能</td>
                        </tr>
                        <tr>
                            <td width="300">JSP机试题-理财产品信息管理系统</td>
                            <td width="80"><a href="#">浏览</a></td>
                            <td width="70">无</td>
                            <td width="100">120分钟</td>
                            <td width="300">Java常用API</td>
                        </tr>
                        <tr>
                            <td width="300">JSP机试题-北京市雨量监测信息管理</td>
                            <td width="80"><a href="#">浏览</a></td>
                            <td width="70">无</td>
                            <td width="100">120分钟</td>
                            <td width="300">Java常用API</td>
                        </tr>
                        <tr>
                            <td width="300">JSP机试题-学员信息管理系统</td>
                            <td width="80"><a href="#">浏览</a></td>
                            <td width="70">无</td>
                            <td width="100">120分钟</td>
                            <td width="300">Java常用API</td>
                        </tr>
                        <tr>
                            <td width="300">JSP机试题-图书管理器</td>
                            <td width="80"><a href="#">浏览</a></td>
                            <td width="70">无</td>
                            <td width="100">120分钟</td>
                            <td width="300">Java常用API</td>
                        </tr>
                        <tr>
                            <td width="300">JSP机试题-图书管理器</td>
                            <td width="80"><a href="#">浏览</a></td>
                            <td width="70">无</td>
                            <td width="100">120分钟</td>
                            <td width="300">Java常用API</td>
                        </tr>
                    </table>
                </div>
                <div class="fanyei">
                    <div id="bjin" class="yeishu">1</div>
                    <div class="yeishu">2</div>
                    <div class="yeishu">3</div>
                    <div class="yeishu">4</div>
                </div>
            </div>
            <div class="brd">
                做题数量分析
            </div>
            <div class="systs">
                您最近三个月做题3770道，完成题目数量具体时间分布如下：
            </div>
            <div class="sztu">
                <img src="img/img_10.png"/>
            </div>
            <div class="asjcz">
                按时间查找:<input class="rqkbj" type="date" id="dateInput">至<input class="rqkbj" type="date" id="dateInput1">
                <div class="stcx">Go</div> 查询结果：共完成0道试题，正确率0%
            </div>

            <%--刷题选择--%>
            <form method="post" action="PagerinsertServlet">
            <div id="zhuangxjn"  class="zhuangxjn">
                <div class="xkuang">
                    <div class="zxjnlx">
                        <div class="zxlxi">专项技能练习</div>
                        <div  onclick="tchust()" class="xtueichu">X</div>
                    </div>
                    <div class="zxlxzhuti">
                        <%--                        内容体--%>
                        <c:forEach var="curriculum" items="${curriculums}">
                            <div class="kecheng-list">
                                <!--  课程-->
                                <div class="kecheng1">
                                    <div id="yijil" class="name">${curriculum.csection}</div>
                                    <!--    章节-->
                                    <c:forEach var="curriculum1" items="${curriculum.children}">
                                        <div class="zhangjie">
                                            <div id="erjil" class="name">
                                                <div class="xnpb">
                                                    <div class="erji">${curriculum1.csection}</div>
                                                    <div class="rkhjd">
                                                        <div class="dxiang">
                                                            <div class="rkjg"></div>
                                                            <div class="jrcshi"><a href="PagerinsertServlet?cid=${curriculum1.cid}&tote=10&ptype=2">进入测试</a></div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <!--      知识点列表-->

                                            <div class="zhishidian-list">
                                                <c:forEach var="curriculum2" items="${curriculum1.children}" varStatus="vs">
                                                    <c:if test="${not empty curriculum2.csection}">
                                                        <div class="zsdpb">
                                                            <div class="xnpb">
                                                                <div>${curriculum2.csection}</div>
                                                                <div class="rkhjd">
                                                                    <div class="stjdu">${jindu[vs.index]}%</div>
                                                                    <div class="rkjg"></div>
                                                                    <div class="jrcshi"><a href="PagerinsertServlet?cid=${curriculum2.cid}&tote=10&ptype=2">进入测试</a></div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </c:if>
                                                </c:forEach>
                                            </div>
                                        </div>
                                    </c:forEach>
                                </div>
                            </div>
                            <div class="xhx"></div>
                        </c:forEach>
                    </div>
                </div>
            </div>
            </form>


            <%--刷题选择--%>
            <div id="zhuangxjn2"  class="zhuangxjn">
                <div class="xkuang">
                    <div class="zxjnlx">
                        <div id="zxlxi">请选择要自测的课程</div>
                        <div onclick="tchust2()" class="xtueichu">X</div>
                    </div>
                    <div class="zxlxzhuti">

                        <div class="kecheng-list">
                            <!--  课程-->
                            <div class="kecheng1">
                                <div id="yijil" class="name">总章节</div>
                                <!--    章节-->
                                <c:forEach var="curriculum" items="${curriculums}">
                                <div class="zhangjie">
                                    <div id="erjil" class="name">
                                        <div class="xnpb">
                                            <div class="erji">${curriculum.csection}</div>
                                            <div class="rkhjd">
                                                <div class="dxiang">

                                                    <div class="rkjg"></div>
                                                    <div class="jrcshi"><a href="PagerinsertServlet?cid=2&tote=20&ptype=2">进入测试</a></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!--      知识点列表-->
                                    <div class="zhishidian-list">
                                    </div>
                                </div>
                                </c:forEach>
                            </div>
                        </div>
                    </div>
                </div>
            </div>



            <%--刷题选择--%>
            <div id="zhuangxjn3"  class="zhuangxjn">
                <div class="monitx">
                    <div class="tishi">提示</div>
                    <div class="tishinr">准备好了么，一旦开始考试系统将为您计时!</div>
                    <div class="stipb">
                        <div onclick="tchust3()" class="stqrr">让我再想想</div>
                        <div class="mmm"></div>
                        <div class="stqrr">开始考试</div>
                    </div>
                </div>
            </div>



            <div class="sanch">
                <div onclick="showBox(1)" id="jind1" class="jind1">按技能点分析</div>
                <div onclick="showBox(2)" id="jind2" class="jind2">按课程分析</div>
                <div onclick="showBox(3)" id="jind3" class="jind3">按课程分析</div>
            </div>
            <div id="box1" class="box">
                <div class="kzhixs">
                    <div class="jge"></div>
                    <div class="shaix">
                        按课程筛选<select class="kcsx">
                        <option value="option1">选项1</option>
                        <option value="option2">选项2</option>
                        <option value="option3">选项3</option>
                    </select>
                        时间<select class="shijsx">
                        <option value="option1">最近一周</option>
                        <option value="option2">最近一月</option>
                    </select>
                    </div>
                    <div>
                        <table border="1px #000000 solid" cellspacing="0" cellpadding="0.1"  class="jinfxibiao">
                            <tr>
                                <td width="110">序号	</td>
                                <td width="370">技能点</td>
                                <td width="137">答题数量</td>
                                <td width="160">平均正确率</td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>1</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>2</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>3</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>4</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>5</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>6</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>7</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>8</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>9</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                            <tr>
                                <td>10</td>
                                <td>技能点</td>
                                <td>0</td>
                                <td>0.0%</td>
                                <td><a href="#">继续练习</a></td>
                            </tr>
                        </table>
                        <div class="jge1"></div>
                        <div class="jndfy">
                            <div>共包含 134 技能点</div>
                            <div class="fyxze">
                                <div class="fypaib"><a href="#">首页</a></div>
                                <div class="fypaib"><a href="#">上页</a></div>
                                <div class="fypaib"><a href="#">下页</a></div>
                                <div class="fypaib"><a href="#">尾页</a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="box2" class="box">
                <div class="akcfxi">
                    <div><img src="img/img_11.png" /></div>
                    <div class="knwb">最近一周您共完成<span class="hzit">40套</span>课程复习型试卷，其中：<br/>
                        《Java开发之Java Web编程》《Java开发之Java数据库编程》《前端开发之JS+jQuery入门》《Java开发之面向对<br/>象
                        编程》的整体正确率都达到了<span class="hzit">60%</span>以上，建议您针对该课程各项技能弱项进行针对性复习，请切换到按<span class="lanzit">技能点分<br/>析</span>
                        查看该课程的技能点弱项，争取更大的提升。<br/>
                        各个课程的评测具体如下：</div>
                </div>
                <div class="sjcx">
                    时间
                    <select class="shijsx">
                        <option value="option1">最近一周</option>
                        <option value="option2">最近一月</option>
                    </select>
                </div>
                <div class="akcfxb">
                    <table class="akzztjz"  width="970" border="1" cellspacing="0" cellpadding="1">
                        <tr class="dyih">
                            <td>序号</td>
                            <td>课程</td>
                            <td>答题套数</td>
                            <td>答题数</td>
                            <td>平均正确率</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>1</td>
                            <td>Java开发之Java Web编程</td>
                            <td>4</td>
                            <td>180</td>
                            <td>60%</td>
                            <td>继续测试</td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>Java开发之Java数据库编程	</td>
                            <td>15</td>
                            <td>30</td>
                            <td>60%</td>
                            <td>继续测试</td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>前端开发之JS+jQuery入门</td>
                            <td>14</td>
                            <td>140</td>
                            <td>60%</td>
                            <td>继续测试</td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>Java开发之面向对象编程</td>
                            <td>4</td>
                            <td>答题数</td>
                            <td>60%</td>
                            <td>继续测试</td>
                        </tr>
                    </table>
                </div>
            </div>
            <div id="box3" class="box">
                <div class="mnzhuti">
                    <div><img src="img/pc-2.gif"/></div>
                    <div class="mnziti">
                        您尚未进行过模拟结业测试，建议您进行几次模拟测试，确保正式结业考试顺利通过！<br/><br/><br/>
                        <a href="#">开始测试></a>
                    </div>
                </div>
                <div class="mnbjv">各次模拟测试的具体成绩分布如下：</div>
                <div class="mntp">
                    <img src="img/Z.jpeg"/>
                </div>
            </div>
        </div>
    </div>
    <%@ include file="ProjectPage/Dibu.jsp" %>
</div>
<script src="bootstrap/js/jquery-3.2.1.min.js"></script>
<script>
    // 获取当前日期
    var today = new Date();

    // 格式化日期为 yyyy-mm-dd
    var formattedDate = today.toISOString().split("T")[0];

    // 将日期插入到日期输入框
    var dateInput = document.getElementById("dateInput");
    dateInput.value = formattedDate;
    var dateInput1 = document.getElementById("dateInput1");
    dateInput1.value = formattedDate;

    //显示按技能点分析
    var box1 = document.getElementById("box1");
    box1.style.display = "block";

    function showBox(boxNumber) {
        // 隐藏所有盒子
        hideAllBoxes();

        var jind = document.getElementById("jind" + boxNumber);
        jind.style.backgroundColor = "#a0c001";
        jind.style.color = "#ffffff";
        jind.style.zIndex = 3;

        // 根据参数显示对应的盒子
        var box = document.getElementById("box" + boxNumber);
        box.style.display = "block";
    }

    function shijrko3(){
        var zhuangxjn3 = document.getElementById("zhuangxjn3");
        zhuangxjn3.style.display="flex";
    }

    function tchust3(){
        var zhuangxjn3 = document.getElementById("zhuangxjn3");
        zhuangxjn3.style.display="none";
    }

    function shijrko2(){
        var zhuangxjn2 = document.getElementById("zhuangxjn2");
        zhuangxjn2.style.display="flex";
    }

    function tchust2(){
        var zhuangxjn = document.getElementById("zhuangxjn2");
        zhuangxjn.style.display="none";
    }

    function tchust(){
        var zhuangxjn = document.getElementById("zhuangxjn");
        zhuangxjn.style.display="none";
    }

    function shijrko(){
        var zhuangxjn = document.getElementById("zhuangxjn");
        zhuangxjn.style.display="flex";
    }

    function hideAllBoxes() {
        var boxes = document.getElementsByClassName("box");
        //查询class中以jind开头的样式
        var jind = document.querySelectorAll("[class^=jind]");
        for (var i=0;i<jind.length;i++){
            jind[i].style.backgroundColor = "rgb(221,221,221)";
            jind[i].style.color = "#000000";
            jind[i].style.zIndex = 0;
        }
        for (var i = 0; i < boxes.length; i++) {
            boxes[i].style.display = "none";
        }
    }

    $(function (){
        $('.kecheng-list>.kecheng1>.zhangjie>.zhishidian-list').hide();

        $('.kecheng-list>.kecheng1>.name').on('click',function (){
            $(this).nextAll('.zhangjie').slideToggle();
        })
        $('.kecheng-list>.kecheng1>.zhangjie>.name').on('click',function (){
            $(this).next('.zhishidian-list').slideToggle();
        })
    })

    // 当文档加载完成后，应用样式
    $(document).ready(function() {
        // 使用文本匹配选择器找到文本为“我的历史”的元素
        $('div:contains("我的自测")').eq(4).addClass('bjing');
    });
</script>
</body>
</html>